<%@ page language="java" contentType="text/html; charset=UTF-8"
		 pageEncoding="UTF-8"%>
<%@include file="base.jsp"%>
<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>用户管理</title>
	<script type="text/javascript" src="static/js/common-css.js"></script>
	<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Poppins:300,400,700">
	<style type="text/css">
		.bg-white {
			padding-left: 20px;
			padding-top: 20px;
		}

		.bg-white .input-material {
			padding-left: 10px;
		}
	</style>
</head>
<body>
<div class="col-lg-6 bg-white">
	<div class="form d-flex align-items-center">
		<div class="content">
			<div class="form-group">
				<span>昵称</span>
				<input id="body-nickname" class="input-material" type="text" name="nickName" disabled="disabled"
					   value="${ user.nickName }">
			</div>
			<div class="form-group">
				<span>日期</span>
				<input id="body-data" class="input-material" type="text"
					   name="lowBloodPressure" placeholder="请输入日期">
				<div class="invalid-feedback">日期不能为空</div>
			</div>
			<div class="form-group">
				<span>体温</span>
				<input id="body-temperature" class="input-material" type="text"
					   name="weight" placeholder="请输入体温">
				<div class="invalid-feedback">体温不能为空</div>
			</div>

			<div class="form-group">
				<span>接触对象</span>
				<input id="body-time" class="input-material" type="text"
					   name="highBloodPressure" placeholder="请输入接触对象">
				<div class="invalid-feedback">接触对象不能为空</div>
			</div>
			<div class="form-group">
				<span>外出情况</span>
				<input id="body-calorie" class="input-material" type="text"
					   name="heartRate" placeholder="请输入外出情况">
				<div class="invalid-feedback">外出情况不能为空</div>
			</div>

			<div class="form-group">
				<span>是否发热</span>
				<input id="body-type" class="input-material" type="text"
					   name="heartRate" placeholder="请输入是否发热">
				<div class="invalid-feedback">是否发热不能为空</div>
			</div>

			<div class="form-group">
				<button id="submit" type="button" name="submit" class="btn btn-primary">打卡</button>
				<button id="reset" type="reset" name="reset" class="btn btn-primary" style="margin-left: 40px">重置</button>
			</div>
		</div>
	</div>
</div>
<script src="static/js/common-js.js"></script>
<script>
	$(function() {
		/*错误class  form-control is-invalid
        正确class  form-control is-valid*/
		var flaglowBloodPressure = false;
		var flagHighBloodPressure = false;
		var flagHeartRate = false;
		var flagTemperature = false;
		var flagType;
		var lowBloodPressure, highBloodPressure, heartRate, temperature,type;
		$("#body-temperature").change(function() {
			lowBloodPressure = $(this).val();
			if (!lowBloodPressure ) {
				$(this).removeClass("form-control is-valid").addClass("form-control is-invalid");
				flaglowBloodPressure = false;
			} else {
				$(this).removeClass("form-control is-invalid").addClass("form-control is-valid");
				flaglowBloodPressure = true;
			}
		})
		$("#body-data").change(function() {
			highBloodPressure = $(this).val();
			if (!highBloodPressure) {
				$(this).removeClass("form-control is-valid").addClass("form-control is-invalid");
				flagHighBloodPressure = false;
			} else {
				$(this).removeClass("form-control is-invalid").addClass("form-control is-valid");
				flagHighBloodPressure = true;
			}
		})
		$("#body-time").change(function() {
			heartRate = $(this).val();
			if (!heartRate) {
				$(this).removeClass("form-control is-valid").addClass("form-control is-invalid");
				flagHeartRate = false;
			} else {
				$(this).removeClass("form-control is-invalid").addClass("form-control is-valid");
				flagHeartRate = true;
			}
		})
		$("#body-calorie").change(function() {
			temperature = $(this).val();
			if (!temperature) {
				$(this).removeClass("form-control is-valid").addClass("form-control is-invalid");
				flagTemperature = false;
			} else {
				$(this).removeClass("form-control is-invalid").addClass("form-control is-valid");
				flagTemperature = true;
			}
		})

		$("#body-type").change(function() {
			type = $(this).val();
			if (!temperature) {
				$(this).removeClass("form-control is-valid").addClass("form-control is-invalid");
				flagType = false;
			} else {
				$(this).removeClass("form-control is-invalid").addClass("form-control is-valid");
				flagType = true;
			}
		})

		$("#submit").click(function() {
			if (flaglowBloodPressure && flagHighBloodPressure && flagHeartRate && flagTemperature && flagType ) {
				$.ajax({
					url: "${baseurl}/health/saveBodyEpidemicInfo",
					type: 'POST',
					dataType: "json",
					contentType: "application/json",
					data: JSON.stringify({
						'temperature': lowBloodPressure,
						'data': highBloodPressure,
						'time': heartRate,
						'calorie': temperature,
						'type':type

					}),
					success: function(data) {
						alert(data.message)
						if (data.result == true) {
							$("input").each(function() {
								$(this).removeClass("form-control is-invalid").val("");
							});
							$("#body-foodType").removeClass("is-valid is-invalid").val("-请选择-");
							$("#body-foodDate").removeClass("is-valid is-invalid").val("-请选择-");
							$("#body-nickname").val('${user.nickName}');
						} else {
							if (data.path) {
								top.location.href=data.path;
							}
						}
					}
				});
			} else {
				if (!flaglowBloodPressure) {
					$("#body-temperature").addClass("form-control is-invalid");
				}
				if (!flagHighBloodPressure) {
					$("#body-data").addClass("form-control is-invalid");
				}
				if (!flagHeartRate) {
					$("#body-time").addClass("form-control is-invalid");
				}
				if (!flagTemperature) {
					$("#body-calorie").addClass("form-control is-invalid");
				}
				if (!flagType) {
					$("#body-type").addClass("form-control is-invalid");
				}
			}
		})
		// 重置
		$("#reset").click(function() {
			$("input").each(function() {
				$(this).removeClass("form-control is-invalid").val("");
			});
			$("#body-nickname").val('${user.nickName}');
		})
	})
</script>
</body>
</html>
